import React from 'react'
import withMouseListener from './withMouseListener'

function Point(props) {
    return <>
        横坐标X: {props.x}, 纵坐标Y: {props.y}
    </>
}

function MoveDiv(props) {
    return <div style={{
        height: 100,
        width: 100,
        backgroundColor: '#008C8C',
        position: 'absolute',
        left: props.x ? props.x - 50 : 0,
        top: props.y ? props.y - 50 : 0
    }}></div>
}

const P = withMouseListener(Point)
const MD = withMouseListener(MoveDiv)

export default function HOCTest() {
    return (
        <div>
            <P />
            <MD />
        </div>
    )
}
